
// 用于快速编辑某些属性,需要与后端定义的数据高度同步
export default {
  name: 'propEdit',
  props: {
    // 数据对象
    obj: {
      type: Object,
      default () {
        return {}
      }
    },
    // 当前编辑中的属性
    propEditing: {
      type: String,
      default: null
    }
  },
  data () {
    return {
      data: this.obj
    }
  },
  computed: {
    // 整体是否可通行,或者整体视野是否连通的Icon
    totalIcon () {
      return (array) => {
        if (!array) {
          return 'md-close'
        }
        // 全是false不可通行
        if (array.indexOf(true) < 0) {
          return 'md-close'
        }
        // 全是true可通行
        else if (array.indexOf(false) < 0) {
          return 'md-checkmark'
        }
        // true false混杂,则通行性特殊
        return 'md-help'
      }
    },
    
    // 方向通行或者视野联通的Icon
    // 该物体的四方向连通性,0-7对应:左入/上入/右入/下入/左出/上出/右出/下出
    // 物体的四方向视野,0-3对应:左/上/右/下
    directionIcon () {
      return (array, index, isReverse = false) => {
        if (!array) {
          return 'md-close'
        }
        const sign = array[index]
        // false代表不可通行
        if (!sign) {
          return 'md-close'
        }
        // 可通行的情况下,判断index
        switch (index) {
          case 0:
            return isReverse ? 'md-arrow-round-forward' : 'md-arrow-round-back'
          case 1:
            return isReverse ? 'md-arrow-round-down' : 'md-arrow-round-up'
          case 2:
            return isReverse ? 'md-arrow-round-back' : 'md-arrow-round-forward'
          case 3:
            return isReverse ? 'md-arrow-round-up' : 'md-arrow-round-down'
        }
      }
    },
  },
  methods: {
    // 数据改变触发事件
    onChange () {
      this.$emit('on-change', this.data)
    },
    
    // 设置可通行性或者视野连通性
    setDirection (key, index = null) {
      let data = this.data[key]
      
      // 未设置索引
      if (index === null) {
        if (data.indexOf(true) < 0 || data.indexOf(false) < 0) {
          // 完全可通行或者完全不可通行,全部取反
          data = data.map(item => !item)
        }
        else {
          // 否则变为不可通行
          data = data.map(item => false)
        }
      }
      else {
        // 设置索引
        this.$set(data, index, !data[index])
      }
      
      this.$set(this.data, key, data)
      
      // 触发事件
      this.onChange()
    },
    
    // 设置层级
    setLayer (isForward = true) {
      // 获取目标数据
      const maxLayer = 60
      const minLayer = 10
      const setNum = 10
      if (isForward) {
        if (this.data.layer < maxLayer) {
          this.data.layer = this.data.layer + setNum
        }
        else {
          this.data.layer = minLayer
        }
      }
      else {
        if (this.data.layer > minLayer) {
          this.data.layer = this.data.layer - setNum
        }
        else {
          this.data.layer = maxLayer
        }
      }
      
      // 触发事件
      this.onChange()
    },
  },
  watch: {
    // 双向绑定
    obj: {
      handler (newVal, oldVal) {
        this.data = newVal
      },
      deep: true
    }
  }
}